<template>
    <div>
        <div class="survey-list" v-for="(questionnaire,index) in questionnaireInfo" :index=index
             v-if="(userId == questionnaire.publishId && ((queryPublishState == 2 && questionnaire.isDelete == queryIsDelete) ||
             ( questionnaire.isDelete == queryIsDelete && queryPublishState == questionnaire.publishState)))">
            <dl class="survey-items" style="z-index:100;position:relative">
                <dt class="item-top" @click="$router.push({name: 'Fill', params: {id: questionnaire.id}})"
                    target="_blank">
                    <div class="pull-left">
                        <a @click="$router.push({name: 'Fill', params: {id: questionnaire.id}})" target="_blank"
                           class="pull-left item-tit" :title="questionnaire.name"
                        >{{questionnaire.name}}</a>
                    </div>
                    <div class="pull-right">
                        <div class="pull-left item-id">id {{questionnaire.id}}</div>
                        <div class="pull-left item-draft"><i class="nopublic"></i>{{questionnaire.publishState==1?'发布':'未发布'}}
                        </div>
                        <div class="pull-left item-sheet">答卷:<a href=""
                                                                class="runing-num">{{questionnaire.finishCount}}</a>
                        </div>
                        <div class="pull-left item-data">{{FormatDat(questionnaire.createTime)}}</div>
                    </div>
                </dt>
                <dd class="item-bot">
                    <div v-if="queryIsDelete != 1" class="process-box pull-left">
                        <dl class="process-1 pull-left">
                            <dd class="spinner-list" style="padding-right: 30px">
                                <a @click="editQuestionnaire(questionnaire.publishState,questionnaire.id)"
                                   style="cursor: pointer;">
                                    <i class="icon design-icon"></i>
                                    设置问卷
                                </a>
                            </dd>
                        </dl>
                        <dl class="process-2 pull-left">
                            <dd class="spinner-list">
                                <a @click="sendQuestionnaire(questionnaire.publishState,questionnaire.id)"
                                   style="cursor: pointer;">
                                    <i class="icon recovery-icon"></i>
                                    发送问卷
                                </a>
                            </dd>
                        </dl>
                        <dl class="process-2 pull-left">
                            <dd class="spinner-list" style="padding-left: 30px">
                                <a @click="sendDownloadId(questionnaire.id)" style="cursor: pointer;">
                                    <i class="icon download-icon"></i>
                                    分析&下载
                                </a>
                            </dd>
                        </dl>

                    </div>
                    <div v-if="queryIsDelete != 1" class="operation-box pull-right">
                        <div v-if="questionnaire.publishState == 0" class="pull-left release-items"
                             title="此问卷状态是草稿，点击发布问卷">
                            <i class="el-icon-platform-eleme"></i>
                            <span class="vam"
                                  @click="iterator = publicQuestionnaire(questionnaire), iterator.next()">发布</span>
                        </div>

                        <div v-if="questionnaire.publishState == 1" class="pull-left release-items"
                             title="此问卷状态是发布，点击回收问卷">
                            <i class="el-icon-platform-eleme"></i>
                            <span class="vam" @click="iterator = unPublicQuestionnaire(questionnaire), iterator.next()">取消发布</span>
                        </div>

                        <div class="fl control-items" title="删除此问卷" style="padding-left: 25px">
                            <i class="el-icon-delete-solid"></i>
                            <span class="vam"
                                  @click="iterator = deleteQuestionnaire(questionnaire), iterator.next()">删除</span>
                        </div>
                    </div>
                    <div v-if="queryIsDelete == 1" class="operation-box pull-right">
                        <div class="fl control-items" title="恢复此问卷" style="padding-left: 25px">
                            <i class="el-icon-s-help"></i>
                            <span class="vam" @click="iterator = recoverQuestionnaire(questionnaire), iterator.next()">恢复</span>
                        </div>
                    </div>
                </dd>
            </dl>
        </div>
    </div>
</template>

<script>
    import moment from '../moment.min.js';
    import "@/assets/css/questionnaireIndex.css";

    export default {
        name: "test2",
        components: {},
        data() {
            return {
                iterator: {},
                questionnaireInfo: [],
                queryPublishState: this.$route.params.id,
                queryIsDelete: this.$route.params.isDelete,
                userId: sessionStorage.getItem("id"),
            }
        },
        created() {
            const _this = this;
            this.axios.get("http://localhost:8088/getQuestionnaire").then(function (resp) {
                _this.questionnaireInfo = resp.data;
                console.log(_this.questionnaireInfo);
            })
        },
        methods: {
            checkItem(item, flag = null) {
                if (typeof item.checked === 'undefined') {
                    Vue.set(item, 'checked', true);
                } else if (flag !== null) {
                    item.checked = !flag;
                } else {
                    item.checked = !item.checked;
                }
            },
            FormatDat: function (data) {
                return moment(data).format('YYYY-MM-DD');
            },
            showPrompt(text) {
                this.promptText = text;
                this.isShowPrompt = true;
            },

            sendDeleteId: function (questionnaire) {
                this.axios({
                    url: "http://localhost:8088/deleteQuestionnaire",
                    method: "get",
                    params: {
                        'id': questionnaire.id
                    }
                }).then({})
            },
            snedRecoverId: function (questionnaire) {
                this.axios({
                    url: "http://localhost:8088/recoverQuestionnaire",
                    method: "get",
                    params: {
                        'id': questionnaire.id
                    }
                }).then({})
            },

            publicNaire: function (questionnaire) {
                this.axios({
                    url: "http://localhost:8088/publicQuestionnaire",
                    method: "get",
                    params: {
                        'id': questionnaire.id
                    }
                }).then({})
            },
            unPublicNaire: function (questionnaire) {
                this.axios({
                    url: "http://localhost:8088/unPublicQuestionnaire",
                    method: "get",
                    params: {
                        'id': questionnaire.id
                    }
                }).then({})
            },
            editQuestionnaire: function (publicState, questionnaireId) {
                if (publicState === 1) {
                    var r = confirm("该问卷处于发布中无法修改");
                    if (r == true) {
                        return;
                    } else {
                        return;
                    }
                } else if (publicState === 0) {
                    this.$router.push({name: 'Edit', params: {id: questionnaireId}})
                }
            },
            sendQuestionnaire: function (publicState, questionnaireId) {
                if (publicState === 0) {
                    var r = confirm("该问卷处于未发布状态无法发送！");
                    if (r == true) {
                        return;
                    } else {
                        return;
                    }
                } else if (publicState === 1) {
                    var r = confirm("访问问卷的连接http://localhost:8080/fill/" + questionnaireId);
                    if (r == true) {
                        return;
                    } else {
                        return;
                    }
                }
            },
            sendDownloadId: function (questionnaireId) {
                this.axios({
                    url: "http://localhost:8088/downLoad",
                    headers: {
                        'Content-Type': 'application/json;charset=utf-8'
                    },
                    method: "post",
                    params: {
                        'questionnaireId': encodeURI(JSON.stringify(questionnaireId))
                    }
                }).then({})

                const loading = this.$loading({
                    lock: true,
                    text: 'Loading',
                    spinner: 'el-icon-loading',
                    background: 'rgba(0, 0, 0, 0.7)'
                });
                setTimeout(() => {
                    loading.close();
                    var r = confirm("导出成功，已导出到项目目录下");
                    if (r == true) {
                    } else {
                        return;
                    }
                }, 2000);
            },
            * deleteQuestionnaire(questionnaire) {
                var r = confirm("确认要删除所选问卷？");
                if (r == true) {
                    this.sendDeleteId(questionnaire);
                    questionnaire.isDelete = 1;
                } else {
                    return;
                }
            },

            * recoverQuestionnaire(questionnaire) {
                var r = confirm("确认要恢复所选问卷？");
                if (r == true) {
                    this.snedRecoverId(questionnaire);
                    questionnaire.isDelete = 0;
                } else {
                    return;
                }
            },
            * publicQuestionnaire(questionnaire) {
                var r = confirm("确认要发布所选问卷？");
                if (r == true) {
                    this.publicNaire(questionnaire);
                    questionnaire.publishState = 1;
                    var q = confirm("访问问卷的连接http://localhost:8080/fill/" + questionnaire.id);
                    if (q == true) {
                        return;
                    } else {
                        return;
                    }
                } else {
                    return;
                }
            },
            * unPublicQuestionnaire(questionnaire) {
                var r = confirm("确认要取消发布所选问卷？");
                if (r == true) {
                    this.unPublicNaire(questionnaire);
                    questionnaire.publishState = 0;
                } else {
                    return;
                }
            }
        }
    }
</script>

<style scoped lang="scss">

</style>
